$(function () {
    // 获取localstorage数据
    var carts = (function () {
        if (localStorage.getItem("cart")) {
            var data = null;
            try {
                data = JSON.parse(localStorage.getItem("cart"))
            } catch (e) {
                data = {}
            }
            return data
        } else {
            return {}
        }
    })


    // 购物车渲染
    dye()
    prices()


    $("#select_all").change(function () {
        var $checkboxs = $(".select");
        // 取出 select_all 的checked属性; 
        var type = $("#select_all").prop("checked");
        // 把属性进行批量赋值; 
        $checkboxs.prop("checked", type)
    })




    function dye() {
        var res = carts()

        var html = ""
        for (var attr in res) {
            html += `  <div class="row clear">
        <div class="piece pice">
            <input class="select" checked type="checkbox">
        </div>
        <div class="goo">
            <img class="lazy" data-original="${res[attr].src}"
                src="${res[attr].src}"
                alt="${res[attr].alt}">
            <p>${res[attr].figureColor}</p>
        </div>
        <div class="single">
        ${res[attr].price}
        </div>
        <div class="count">
            <button>-</button> <input  value="${res[attr].count}" type="text"> <button id="jia">+</button>
        </div>
        <div class="subtotal">
        ${res[attr].count * res[attr].price}

        </div>
        <div class="aperation">
            <button id="${res[attr].id}">删除</button>
        </div>
    </div>`
        }
        $(".content").html(html)
        console.log(1);
    }


    $(".content").on("click", "button", function (e) {
        var cartt = carts()
        e.preventDefault();
        var index = $(this).attr("id")
        delete cartt[index];
        localStorage.setItem("cart", JSON.stringify(cartt))
        dye()
        prices()
    });






    // 计算总价
    function prices() {
        var $pric = $(".totalprice span")
        var $pri = $(".totalprice i")
        var res = []
        var $a = $(".subtotal")
        $.map($a, (item) => res.push($(item).html()))
        var pic = 0;
        for (var i = 1; i < res.length; i++) {
            pic += parseFloat(res[i])
        }
        $pric.html(pic);
        $pri.html(res.length - 1);

    }







})